<template>
	<div class="personal">
		<div class="wrap">
			<div class="weui-cells__title">基础信息</div>
			<group>

				<x-input title="用户名 :" v-model="value"></x-input>
				<x-input title="密码 :" v-model="pass"></x-input>
				 <datetime title="生日 :" v-model="date"></datetime>
				 <popup-radio title="性别 :" :options="options1" v-model="option1"></popup-radio>
				 <x-input title="手机号码 :" mask="999 9999 9999" v-model="tel" :max="13" is-type="china-mobile"></x-input>
				<x-address title="地址 :" v-model="addressVal" placeholder="请选择地址"	:list="addressData"></x-address>

			</group>

		</div>
		 <x-button class='btn' type="primary">保存</x-button>
		<div class="return" @click="goBack">
			<img src="../assets/return.png" alt="">
		</div>
	</div>
</template>
<script>
	import {
		Cell,
		Group,
		XInput,
		XAddress,
		ChinaAddressV4Data,
		PopupRadio,
		Datetime,
		XButton 
	} from 'vux'

	export default {
		components: {
			Group,
			Cell,
			XInput,
			XAddress,
			PopupRadio,
			Datetime,
			XButton 
		},
		data() {
			return {
				value: '',
				pass: '',
				options1:['男','女'],
				option1:'男',
				tel:'',
				date:'',
				addressVal: [],
			 addressData: ChinaAddressV4Data,
			}
		},
		created() {

		},
		mounted() {


		},
		methods: {
			goBack() {
				this.$router.back();
			},
		},


	}
</script>

<style lang="less" scoped="scoped">
	.personal {
		width: 100%;
		height: 100%;
		overflow: hidden;
		.wrap {
			.weui-cells__title{
				padding-top: 10px;
			}
		}
	}
	.btn{
		position: fixed;
		bottom: 0;
		
	}

	.return {
		width: 32px;
		height: 32px;
		position: absolute;
		top: 10px;
		right: 10px;

		img {
			width: 100%;
			height: 100%;
		}
	}
</style>
